<template>
    <div class="grid-content" :style="styleObj">
        <!-- <Divider>使用默认数字渲染</Divider> -->
        <div class="title">
            <slot name="title"></slot>
        </div>

        <div>
            <slot name="content">
                <num-transform size="small" :isAuto="true" :splitLen="3"></num-transform>
            </slot>
            <!-- <num-transform size="small" :isAuto="true" :splitLen="3"></num-transform> -->
        </div>
        <Row class="item-operate" v-if="isShowOperate">
            <Col :span="12">
                <span class="btn">查看源码</span>
            </Col>
            <Col :span="12">
                <span class="btn">下载模板</span>
            </Col>
        </Row>
    </div>
</template>
<script>
export default {
    name: 'gridContent',
    data() {
        return {};
    },
    props: {
        isShowOperate:{
            default:false
        },
        height: {
            default: "250px",
        },
    },
    computed: {
        styleObj() {
            return {
                height: this.height,
            };
        },
    },
};
</script>
<style lang="less" scoped>
.grid-content {
    .title{
        padding:8px 24px;
    }
}
</style>